<template>
  <div>
    <van-nav-bar title="G5矿支付商城" @click-right="$router.push({ path: '/kf' })">
      <van-icon name="service-o" slot="right" />
    </van-nav-bar>
    <main>
      <div>
        <MyIconTab
          v-for="item in tabdata"
          :key="item.title"
          v-bind:tabdata="item"
          @click.native="go(item.url)"
        />
      </div>
      <van-notice-bar
        color="#61698D"
        background="#13173D"
        left-icon="volume-o"
        mode="link"
        @click="$router.push({ path: '/news' })"
      >通知内容</van-notice-bar>
      <van-notice-bar color="#D8D8D8" background="#13173D">通知内容</van-notice-bar>
    </main>
    <MyFooter :active="0" />
  </div>
</template>

<script>
import MyFooter from "../../components/MyFooter.vue";
import MyIconTab from "../../components/MyIconTab.vue";
// import { resolve } from "dns";
export default {
  name: "",
  components: {
    MyIconTab,
    MyFooter
  },
  data() {
    return {
      tabdata: [
        {
          title: "线上商城",
          background: {
            start: "#bf37d8",
            end: "#fd6556 "
          },
          background1: {
            start: " rgba(191, 55, 216,.23)",
            end: "rgba(253, 101, 86,.23) "
          },
          img: require("../../assets/img/index/jfsc.png")
        },
        {
          title: "我的矿机",
          url: "/mine",
          background: {
            start: "#FF7200",
            end: "#ECBA47 "
          },
          background1: {
            start: " rgba(255,114,0,.23)",
            end: "rgba(236,186,71,.23) "
          },
          img: require("../../assets/img/index/jfsc.png")
        },
        {
          title: "我的钱包",
          background: {
            start: "#9D5AFD",
            end: "#6B42F5"
          },
          background1: {
            start: " rgba(157,90,253,.23)",
            end: "rgba(107,66,245,.23) "
          },
          img: require("../../assets/img/index/qb.png")
        }
      ]
    };
  },

  methods: {
    go(url) {
      this.$router.push({ path: url });
    }
  }
};
</script>

<style lang="less" scoped>
main {
  padding: 20px 0;
}
</style>
